<template>
	<view class="container">
		<view class="topImg">
			<image src="/static/userTop.png"></image>
			<!-- 登录 -->
			<view class="login">
				<view class="txImg">
					<image :src="photo"></image>
				</view>
				<view class="loginText" v-if="token&&userInfo.userName" @click="handleLogin">{{userInfo.userName }}
				</view>
				<view class="loginText" v-if="token&&!userInfo.userName" @click="handleLogin">{{userInfo.phonenumber}}
				</view>
				<!-- <view class="loginText" v-if="token&&!userInfo.userName" @click="handleLogin">{{userInfo.userName }}</view> -->
				<view class="loginText" v-if="!token" @click="handleLogin">{{ app.language.loginText }}</view>
			</view>
			<!-- 民警列表 -->
			<view class="listBox" v-if="userInfo.peopleType=='police'">
				<!-- 人员信息 -->
				<view class="listItem" @click="handleList(1)">
					<image src="/static/yhxx.png"></image>
					<text>{{ app.language.userInfo }}</text>
					<image src="/static/more.png" class="more"></image>
				</view>
				<!-- 日常健康信息 -->
				<view class="listItem" @click="handleList(2)">
					<image src="/static/jk.png"></image>
					<text>{{ app.language.rcInfo }}</text>
					<image src="/static/more.png" class="more"></image>
				</view>
				<!-- 基础健康信息 -->
				<view class="listItem" @click="handleList(3)">
					<image src="/static/jbjk.png"></image>
					<text>{{ app.language.jbInfo }}</text>
					<image src="/static/more.png" class="more"></image>
				</view>
				<!-- 提交记录 -->
				<!-- <view class="listItem" @click="handleList(4)">
					<image src="/static/tjjl.png"></image>
					<text>{{ app.language.userTj }}</text>
					<image src="/static/more.png" class="more"></image>
				</view> -->
				<!-- 我的消息 -->
				<!-- <view class="listItem" @click="handleList(5)">
					<image src="/static/info.png"></image>
					<text>{{ app.language.userMessage }}</text>
					<image src="/static/more.png"></image>
				</view> -->
			</view>
			<!-- 群众列表 -->
			<view class="listBox" v-else>
				<!-- 用户信息 -->
				<view class="listItem" @click="handleList(6)">
					<image src="/static/yhxx.png"></image>
					<text>{{ app.language.userInfo }}</text>
					<image src="/static/more.png"></image>
				</view>
				<!-- 提交记录 -->
				<!-- <view class="listItem" @click="handleList(4)">
					<image src="/static/tjjl.png"></image>
					<text>{{ app.language.userTj }}</text>
					<image src="/static/more.png"></image>
				</view> -->
				<!-- 我的消息 -->
				<!-- <view class="listItem" @click="handleList(5)">
					<image src="/static/info.png"></image>
					<text>{{ app.language.userMessage }}</text>
					<image src="/static/more.png"></image>
				</view> -->
			</view>
			<!-- 退出登录 -->
			<view class="tcLogin" @click="tcLogin" v-if="token">
				{{ app.language.userTcLogin }}
			</view>
			<!-- 群众信息不完善的弹窗 -->
			<uni-popup ref="popup" type="bottom" border-radius="10px 10px 0 0" class="popup">
				<view class="Ptitle">
					<button @click="handleUserInfo">{{app.language.improve}}</button>
				</view>
			</uni-popup>
			<!-- 工作人员信息不完善弹窗 -->
			<uni-popup ref="policePopup" type="bottom" border-radius="10px 10px 0 0" class="popup">
				<view class="Ptitle">
					<button @click="handleUserInfo">{{app.language.improve}}</button>
				</view>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	const global = getApp().globalData;
	export default {
		data() {
			return {
				app: {
					global: global,
					name: global.appName,
					language: global.language
				},
				token: "",
				userInfo: {},
				peopleType: "",
				photo: "../../static/userImg.png"

			}
		},
		onLoad() {
			this.getToken()
		},
		methods: {
			getToken() {
				let that = this
				uni.getStorage({
					key: 'loginData',
					success: function(res) {
						that.token = res.data.userInfo.appToken
						that.userInfo = res.data.userInfo
						console.log('that.userInfo.peopleType', that.userInfo.peopleType)
						if (that.userInfo.peopleType == "people") {
							console.log('2222222222')
							if (!that.userInfo.userName && !that.userInfo.idcard &&
								!that.userInfo.idcardFront && !that.userInfo.idcardBack) {
								that.$refs.popup.open('center')
							}
						} else {
							console.log('3333333333',that.userInfo)
							// 身份作证号的
							if (!that.userInfo.agent) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.birthdate) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.idcard) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.nationality) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.policeNumber) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.personnelCategory) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.workTime) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.positionRank) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.marriage) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.height) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.weight) {
								that.$refs.policePopup.open('center')
								return
							}
							if (!that.userInfo.photo) {
								that.$refs.policePopup.open('center')
								return
							}
						}
						// console.log('that.userInfo', that.userInfo)
						// if(res.data.userInfo.photop){
						// 	that.photo = "https://mqzhian.cn:8088"+res.data.userInfo.photop
						// }
					}
				});
			},

			// 跳转
			handleList(item) {
				if (this.token) {
					if (item == 1) {
						uni.navigateTo({
							url: '../user/info',
						});
					} else if (item == 2) {
						uni.navigateTo({
							url: '../user/rcHealth',
						});
					} else if (item == 3) {
						uni.navigateTo({
							url: '../user/jcHealth',
						});
					} else if (item == 4) {
						uni.navigateTo({
							url: '../user/tijiao',
						});
					} else if (item == 5) {
						console.log('我的消息')
					} else if (item == 6) {
						uni.navigateTo({
							url: '../user/peopleInfo',
						});
					}
				} else {
					uni.navigateTo({
						url: '../login/login',
					});
				}

			},

			// 登录
			handleLogin() {
				uni.navigateTo({
					url: '../login/login',
				});
			},

			// 退出登录
			tcLogin() {
				uni.showModal({
					title: this.app.language.ts,
					content: this.app.language.tc,
					success: function(res) {
						if (res.confirm) {
							uni.clearStorageSync();
							setTimeout(function() {
								uni.reLaunch({
									url: '/pages/index/index'
								});
							}, 500);

						} else if (res.cancel) {
							// console.log('取消');
							//TODO
							return
						}
					}
				});
			},

			// 用户信息页面跳转
			handleUserInfo() {
				console.log('this.userInfo', this.userInfo)
				if (this.userInfo.peopleType == "people") {
					uni.navigateTo({
						url: '../user/peopleInfo',
					});
				} else if (this.userInfo.peopleType == "police") {
					uni.navigateTo({
						url: '../user/info',
					});
				}
			},
			// 关闭弹窗
			handleGb() {
				this.$refs.popup.close();
			}
		}
	}
</script>

<style>
	.container {
		width: 100%;
		height: 100%;
	}

	.topImg {
		position: relative;
	}

	.topImg image {
		width: 100%;
		height: 300rpx;
	}

	.txImg {
		width: 110rpx;
		height: 110rpx;
		/* padding: 10rpx; */
		background-color: #fff;
		border-radius: 50%;
		margin: 0 auto;
	}

	.txImg image {
		width: 110rpx;
		height: 110rpx;
		/* margin-top: 10rpx; */
		border-radius: 50%;
	}

	.login {
		position: absolute;
		top: 50rpx;
		left: 0;
		right: 0;
		text-align: center;
	}

	.loginText {
		font-size: 30rpx;
		margin-top: 10rpx;
		color: #fff;
	}

	.listBox {
		width: 90%;
		background: #fff;
		margin: 20rpx auto 0;
		border-radius: 30rpx;
		z-index: 9999;
		position: relative;
		box-shadow: 1px 1px 10rpx #ddd;
		padding: 20rpx 20rpx 40rpx;
	}

	.listItem {
		margin-top: 40rpx;
		border-bottom: 1px dashed #ddd;
		padding-bottom: 10rpx;
	}


	.listItem text {
		color: #b9b9b9;
		font-size: 26rpx;
		width: 84%;
		display: inline-block;
		padding-left: 10rpx;
	}

	.listItem image {
		width: 45rpx;
		height: 45rpx;
		/* float: right; */
		position: relative;
		top: 10rpx;
	}

	.tcLogin {
		background-color: #2f8ef9;
		color: #fff;
		text-align: center;
		padding: 20rpx 0;
		width: 95%;
		border-radius: 10rpx;
		margin: 30rpx auto 0;
		font-size: 26rpx;
	}

	.popup {
		z-index: 9999;
		position: relative;


	}

	.Ptitle {
		background-color: #fff;
		width: 512rpx;
		padding: 50rpx;
		text-align: center;
		border-radius: 10rpx;
	}

	.Ptitle button {
		font-size: 28rpx;
		background: #2f8ef9;
		color: #fff;
	}

	.gb {
		width: 30rpx !important;
		height: 30rpx !important;
		position: absolute;
		top: 10rpx;
		right: 10rpx;
		width: 90%;
	}
	
	.more{
		width: 36rpx!important;
		height: 36rpx!important;
	}
</style>